<template>
    <div class="rightContent">
        <div class="na"  @click="handleClickTo" style="color:#ddd;">
            <img style="width:20px;height:20px;margin-right:30px" src="/home.png" alt="" title="回到主页">
        </div>
    </div>
</template>
<script>
import axios from 'axios'
export default {
    name: 'HeaderSearch',
    data(){
        return{
            keyword:"",
            list: [],
            timer: null,
            cities: null
        }
    },
    computed: {
        hasNoData () {
            return !this.list.length
        }
    },
    methods: {
        handleClickTo(){
            window.location.href = "http://" + window.location.host
            // if(state=="0"){
            //     localStorage.setItem('headerStation',name)
            //     window.location.href="http://192.168.45.99:8080/station/"+name
            // }else{
            //     localStorage.setItem('headerCity',name)
            //     window.location.href="http://192.168.45.99:8080/city/"+name
            // }
        },
        getCityInfo () {
            axios.get('/GetCityStation.json')
                .then(this.handleGetCityInfoSucc)
        },
        handleGetCityInfoSucc (res) {
            const data = res.data
            this.cities = data
        }
    },
    watch: {
        keyword :{
            immediate: true,
            handler: function(){
                if (this.timer) {
                    clearTimeout(this.timer)
                }
            if (!this.keyword) {
                this.list = []
                return
            }
            this.timer = setTimeout(() => {
                const result = []
                console.log(this.cities)
                for (let i=0;i< this.cities.length;i++) {
                    console.log(this.cities[i])
                    if (this.cities[i].name.indexOf(this.keyword) > -1 ||
                        this.cities[i].name.indexOf(this.keyword) > -1) {
                        result.push(this.cities[i])
                    }
                }
                this.list = result
                console.log(this.list)
            }, 100)
            }
            
        }
        
    }
}
</script>
<style lang="stylus" scoped>
    .rightContent
            width: 6.38rem
            height: 6.48vh
            position: relative
            color:#ddd;
            .na
              width: 6.38rem
              line-height: 6.48vh 
              text-align :right 
              font-size:12px
            
</style>


